<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>门诊开始</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
  <link rel="stylesheet" href="../../layuiadmin/style/template.css" media="all">

</head>
<body>

	<div class="layui-fluid">
    	<div class="layui-row layui-col-space15">
    	
    	<!-- 第一个模块开始 -->
          <div class="layui-col-md6">
            <div class="layui-card">
              <div class="layui-card-header">待就诊患者</div>
              <div class="layui-card-body">
                <!-- 第一个模块内容开始 -->
                <table class="layui-hide" id="queuePatients" lay-filter="queuePatients"></table>
					<div style="display: none;" id="rightToolBar">
						<button class="layui-btn  layui-btn-radius layui-btn-sm" type="button" lay-event="next">下一个</button>
					</div>
                <!-- 第一个模块内容结束 -->
              </div>
            </div>
          </div>
          <!-- 第一个模块结束 -->
          
          <!-- 第二个模块开始 -->
          <div class="layui-col-md6">
            <div class="layui-card">
              <div class="layui-card-header">当前就诊患者</div>
              <div class="layui-card-body">
	
				<!-- 第二个模块内容开始 -->
				      <div class="layui-card" style="margin-left: 20px;margin-right: 20px;">
				          <div class="layui-card-body">
				            <table class="layui-table" height="190px">
				              <tbody>
				                <tr>
				                  <td colspan="2">患者id</td>
				                  <td id="patient_id" colspan="2">
				                  
				                  </td>
				                </tr>
				                <tr>
				                  <td colspan="2">患者姓名</td>
				                  <td id="patient_name" colspan="2"> 
				                  
				                 </td>
				                </tr>
				                <tr>
				                  <td >性别</td>
				                  <td id="patient_gender"> </td>
				                  <td > 年龄</td>
				                  <td id="patient_age"></td>
				                </tr>
				                <tr>
				                  <td colspan="4" align="center">
									<button class="layui-btn  layui-btn-radius layui-icon layui-icon-release" id="history">历史门诊记录</button>
									</td>
				                </tr>
				              </tbody>
				            </table>
				          </div>
					</div>
					<!-- 第二个模块结束 -->
			</div>	
			</div>
			</div>	
			<!-- 第二个模块结束 -->
			
			
              
              
            </div>
          </div>
       
<blockquote class="layui-elem-quote" style="margin:20px">请耐心听患者描述，并详细记录在下面文本框</blockquote>

			
			 
	<div class="layui-fluid">
    	<div class="layui-row layui-col-space15">  
    	<!-- 第三个模块开始 -->	
          <div class="layui-col-md12">
            <div class="layui-card">
              <div class="layui-card-header">患者主诉</div>
              <div class="layui-card-body">
              <!-- 第三个模块内容开始 -->
		
					<div class="layui-form-item ">
						<div class="">
							<textarea id="patientDescText" name="patientDesc" placeholder="请输入内容" class="layui-textarea"></textarea>
						</div>
						<br/>
						<div style="float:right">
							<button class="layui-btn layui-icon layui-icon-ok" id="savePatientDesc">保存</button>
						</div>
					</div>
		
              <!-- 第三个模块内容结束 -->
             
              </div>
              </div>
              </div>					
              <!-- 第三个模块结束 -->	
       </div>
          </div>

<!-- 历史记录的弹出框 -->
	<div style="display:none;" id="openHistory">
		<table class="layui-table" id="historyTable">
	  <colgroup>
	    <col width="150">
	    <col width="200">
	    <col>
	  </colgroup>
	  <thead>
	    <tr>
	      <th>门诊时间</th>
	      <th>患者姓名</th>
	      <th>患者描述</th>
	      <th>诊断结果</th>
	      <th>诊断描述</th>
	    </tr> 
	  </thead>
	  <tbody id="historyTbody">
	    
	  </tbody>
	</table>
	</div>

	<script src="../../layuiadmin/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript">
		layui.use(['element','jquery','form','table'],function(){
			var $ = layui.jquery;
			var element=layui.element;
			var laydate=layui.laydate;
			var table =layui.table;
			
			
			//渲染表格
			table.render({
				elem : '#queuePatients',
				url : '/outpatient/findAllNotStartOutpatient',
				title : '未就诊患者',
				//toolbar : "#userToolBar",
				height: '220',
				width:'550',
				skin: 'row',
				fixed : 'left',
				even: true, //开启隔行背景
				page :false,
				cols : [ [

				{
					field : 'outpatientId',
					title : '门诊ID',
					width : 120,
					fixed : 'left',
					align : 'center'
				},{
					field : 'patientName',
					title : '姓名',
					width : 130,
					align : 'center'
				},{
					field : 'patientId',
					title : '患者id',
					width : 130,
					align : 'center'
				},{
					fixed : 'right',
					align : 'center',
					toolbar : '#rightToolBar'
				}

				] ]
			});
			
			
			//行中工具条事件
			table.on('tool(queuePatients)', function(obj) { //注：tool 是工具条事件名，userTable 是 table 原始容器的属性 lay-filter="对应的值"
				var data = obj.data; //获得当前行数据
				var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）

				if (layEvent === 'next') {
					//查询该患者所有信息，并回显到模块二中。并将当前门诊号存入本地cookie中
					var patientId = data.patientId;
					$.ajax({
						url:"/patient/getPatientById?patientId="+patientId,
						contentType:'application/json;charset=utf-8',
						type:"post",
						//data:JSON.stringify(data.field),
						success:function(patient){
							//alert("aaa");
							//alert(patient.patientId);
							//alert(patient.patientId);
							$("#patient_id").append(patient.patientId);
							$("#patient_name").append(patient.patientName);
							$("#patient_gender").append(patient.patientGender);
							$("#patient_age").append(patient.patientAge);
							//alert(patient);
						}
					});
					var outpatientIdConsis = data.outpatientId;
					var patientIdConsis = data.patientId;
					//将当前门诊号和患者id存到cookie中
					var arrLocalStorage = [outpatientIdConsis,patientIdConsis];
					if(window.localStorage){
						localStorage.setItem("localName",arrLocalStorage);
					}else{
						Cookie.write("localName",arrLocalStorage);
					}
					//将该门诊的开始状态改为1
					$.ajax({
						url:"/outpatient/startOutpatient?outpatientId="+outpatientIdConsis,
						contentType:'application/json;charset=utf-8',
						type:"post",
						//data:JSON.stringify(data.field),
						success:function(res){
							alert(res);
						}
					});
				} 
			});
			
			$("#history").click(function(){
				//根据患者id，查询所有门诊记录
				openHistory();
			});
			
			//打开历史记录页面
			function openHistory(){
				var storeData = window.localStorage ? localStorage.getItem("localName"):Cookie.read("localName");
				//alert(storeData);
				var arrStoreData = storeData.split(",");
				var patientId = arrStoreData[1];
				layer.open({
					type:1,
					title:'历史就诊记录',
					content:$("#openHistory"),
					area:['800px','400px'],
					success:function(index){
						$.ajax({
							url:"/outpatient/historyOutpatientByPid?patientId="+patientId,
							contentType:'application/json;charset=utf-8',
							type:"post",
							//data:JSON.stringify(data.field),
							success:function(outpatients){
								console.log(outpatients);
								var historyTbody = document.getElementById("historyTbody");
								var row;
								for(var i=0;i<outpatients.length;i++){
									row = getDataRow(outpatients[i]);
									console.log(row);
									historyTbody.appendChild(row);
								}
							}
						});
					},
					end:function(){
						$("#historyTbody").empty();
					}
				});
			}
			
			
			
			//定义生成一行数据的方法
			function getDataRow(outpatient){
				var row = document.createElement("tr");
				//第一列
				var dateCell = document.createElement("td");
				dateCell.innerHTML = outpatient.outpatientDate;
				row.appendChild(dateCell);
				//第二列
				var patientNameCell = document.createElement("td");
				patientNameCell.innerHTML = outpatient.patientName;
				row.appendChild(patientNameCell);
				//第三列
				var patientDescCell = document.createElement("td");
				patientDescCell.innerHTML = outpatient.patientDesc;
				row.appendChild(patientDescCell);
				//第四列
				var diagnoseCell = document.createElement("td");
				diagnoseCell.innerHTML = outpatient.diagnose;
				row.appendChild(diagnoseCell);
				//第五列
				var diaDescCell = document.createElement("td");
				diaDescCell.innerHTML = outpatient.diaDesc;
				row.appendChild(diaDescCell);
				return row;
			}
			
			//保存患者描述
			$("#savePatientDesc").click(function(){
				//获得当前的门诊号
				var storeData = window.localStorage ? localStorage.getItem("localName"):Cookie.read("localName");
				//alert(storeData);
				var arrStoreData = storeData.split(",");
				var outpatientId = arrStoreData[0];
				var patientDesc = $("#patientDescText").val();
				//alert(outpatientId);
				//console.log(patientDesc);
				$.ajax({
					url:"/outpatient/savePatientDescByOid?outpatientId="+outpatientId+"&patientDesc="+patientDesc,
					contentType:'application/json;charset=utf-8',
					type:"post",
					//data:JSON.stringify(data.field),
					success:function(res){
						alert(res);
					}
				});
			});
		});
	</script>
</body>
</html>